<!-- 表单 -->
<template>
	<view class="content">
		<uni-list>
			<uni-list-item>
				<view slot="body" class="w100 row">
					<view class="fz28 fyyeert">
						手机号码：
					</view>
					<view class="col">
						<input type="text" v-model="textsd" placeholder="请输入内容" class="w100 fz28" />
					</view>
					<icon type="clear" size="18" v-if="textsd"></icon>
				</view>
			</uni-list-item>
			
			<uni-list-item>
				<view slot="body" class="w100 row">
					<view class="fz28 fyyeert">
						产废单位：
					</view>
					<view class="col  row">
						<view class="text col tl">
							666
						</view>
						<uni-icons type="arrowdown" class="mt5"></uni-icons>
					</view>
				</view>
			</uni-list-item>
			

			<uni-list-item>
				<view slot="body" class="w100 row">
					<view class=" fyyeert fz28">
						获取验证码：
					</view>
					<view class="col">
						<input type="text" value="" placeholder="请输入内容" class="w100 fz28" />
					</view>
					<view class="fz28 fyyeert pl20">
						<button type="warn" class="fz26 hqyza cz " >获取验证码</button>
					</view>
				</view>
			</uni-list-item>
			<uni-list-item>
				<view slot="body" class="w100 row">
					<view class=" fyyeert fz28">
						记住密码：
					</view>
					<view class="fz28 col pl20 tr">
						<view class="gxuansert">
							<switch checked="true" style="transform:scale(0.7)" />
						</view>
					</view>
				</view>
			</uni-list-item>
			<uni-list-item>
				<view slot="body" class="w100 row">
					<view class=" fyyeert fz28">
						数字输入框：
					</view>
					<view class="fz28 col pl20 tr">
						<view class="gxuansert">
							<view class="f_b fdsfrtw">
								<uni-number-box  style="transform:scale(0.7)" @change="hsujert" :min="1"></uni-number-box>
							</view>
						</view>
					</view>
				</view>
			</uni-list-item>
			<uni-list-item>
				<view slot="body" class="w100 row">
					<view class="fz28 fyyeert">
						简介：
					</view>
					<view class="col">
						<textarea placeholder="请输入简介" class="w100 fz28" />
						</view>
				</view>
			</uni-list-item>
			
			<uni-list-item>
				<view slot="body" class="w100 row">
					<view class="fz28 fyyeert">
						多选框：
					</view>
					<view class="col fz28">
				<checkbox-group @change="checkboxChange">
				<label>
					<checkbox value="1" style="transform:scale(0.7)"/><text>苹果</text>
				</label>
				<label class="ml20" >
					<checkbox value="2" style="transform:scale(0.7)"/><text>香蕉</text>
				</label>
				 </checkbox-group>
					</view>
				</view>
			</uni-list-item>
			
			
			<uni-list-item>
				<view slot="body" class="w100 row">
					<view class="fz28 fyyeert">
						单选框：
					</view>
					<view class="col fz28">
						  <radio-group @change="radioChange">
					<label class="radio">
						<radio value="1" style="transform:scale(0.7)"/><text>苹果</text>
					</label>
					<label class="radio ml20">
						<radio value="2" style="transform:scale(0.7)"/><text>香蕉</text>
					</label>
					</radio-group>
					
					</view>
				</view>
			</uni-list-item>
			
		</uni-list>
		<view class="z9 fz26" v-if="duoxuan">
			多选框勾选的结果为：{{duoxuan}}
		</view>
		<view class="z9 fz26" v-if="danyuan">
			单选框勾选的结果为：{{danyuan}}
		</view>
	</view>
</template>
<script>
	export default {
		data() {
			return {
				title: 'Hello',
				textsd:'',
				duoxuan:'',
				danyuan:'',
				jjnsre:0
			}
		},
		onLoad() {

		},
		methods: {
			checkboxChange(e){
				console.log(e.detail.value)
				this.duoxuan = JSON.stringify(e.detail.value)
			},
			radioChange(e){
				this.danyuan = e.detail.value
			},
			hsujert(e){
				this.jjnsre = e
			}
		}
	}
</script>
